<!DOCTYPE html>
<html>
<head>
  <title><%= @title || "Please set title" %></title>
  <%= stylesheet_link_tag "client" %>
  <%= javascript_include_tag "client" %>
  <%= csrf_meta_tags %>
</head>
<body>

  <div id="fb-root"></div>
  <script>
    window.fbAsyncInit = function() {
      FB.init({
        appId      : '<%= get_fb_id(request) %>',
        status     : true,
        cookie     : true,
        xfbml      : true
      });
      onFbAsyncInit("<%= client_login_remote_path %>", "<%=  client_logout_remote_path %>");
    };

    $(function() {
      (function(d, s, id){
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) {return;}
        js = d.createElement(s); js.id = id;
        js.src = "//connect.facebook.net/en_US/all.js";
        fjs.parentNode.insertBefore(js, fjs);
      }(document, 'script', 'facebook-jssdk'));
    });
  </script>

  <ul class="bxslider">
    <li><img src="http://s7.postimg.org/g7y5c34yz/background_map.jpg" class='bannerImg'/></li>
    <li><img src="http://s28.postimg.org/l0nnwyaql/background_map2.png" class='bannerImg'/></li>
  </ul>

  <script type="text/javascript">
    $('.bxslider').bxSlider({
      auto: true,
      controls: false,
      pager: false,
      speed: 1000,
      useCSS: true,
      autoHover: true
    });
  </script>

  <div id="menuBar">
    <div id="categoryList">
      <div class="wrapper">
      <% @categories.each_with_index do |c, i| %>
        <div class="<%= @category_id == c.id.to_s ? "selected" : "col" %>">
          <%= link_to(
                  c.name,
                  client_home_path(category_id:c.id),
                ) %>
        </div>
      <% end %>
      </div>
    </div>

    <div id="userInfo">
      <a href="<%= client_cart_detail_path %>">
        <div class="col cart_image"><%= image_tag "cart.png", id: 'cartIconImg' %></div>
        <div class="col cart_label" ><%= t("client.cart") %></div>
        <div class="col cart_count"><%= @cart.sum_quantity %></div>
      </a>
      <div class="col fbAccount">
        <a id="profileLink" href="<%= client_profile_path %>">
          <span class="name"></span>
          <img class="profilePic"></img>
        </a>
        <button class="loginButton"></button>
      </div>
      </a>
    </div>

    <div id='searchBox'>
      <%= form_tag client_home_path, method: :post do %>
        <%= text_field_tag :keyword, @keyword, placeholder: t('client.search') %>
        <%= link_to '[?]', "#{client_info_path}#search_hint", target: '_blank' %>
      <% end %>
    </div>
  </div>

  <div id="contentDiv">
    <%= yield %>
  </div>

  <%= render partial: 'layouts/client_footer' %>

  <script type="text/javascript">
    client();
  </script>

  <script>
    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
    })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

    ga('create', 'UA-25845475-2', 'pari.vn');
    ga('send', 'pageview');

  </script>

</body>
</html>
